<template>
  <div class="ry-table-container">
    <a-table
      v-if="(attrs.dataSource&&attrs.dataSource.length>0)||(attrs['data-source']&&attrs['data-source'].length>0)"
      v-bind="attrs" v-on="listeners">
      <!-- 处理 scopedSlots -->
      <template v-for="slotName in scopedSlots" :slot="slotName" slot-scope="text,record,index">
        <slot :name="slotName" :index="index" :text="text" :record="record">
        </slot>
      </template>
      <!-- 处理 slots -->
      <template v-for="slotName of slots" :slot="slotName">
        <slot :name="slotName"></slot>
      </template>
    </a-table>
    <a-empty v-else class="empty-container" :imageStyle="{'width':'30%'}" :image="emptyImg">
      <slot name="empty"></slot>
    </a-empty>
  </div>
</template>

<script>
import emptyImg from '/static/img/empty.png'
export default {
  name: '',
  components: {},
  data () {
    return {
      emptyImg,
      scopedSlots: [],
      slots: [],
      settings: {
      }
    }
  },
  props: {
  },
  computed: {
    attrs () {
      return Object.assign(this.settings, this.$attrs)
    },
    listeners () {
      return Object.assign({}, this.$listeners)
    }
  },
  watch: {

  },
  methods: {
    getSlots () {
      for (let slot in this.$scopedSlots) {
        this.scopedSlots.push(slot)
      }
      for (let slot in this.$slots) {
        this.slots.push(slot)
      }
    }
  },
  filters: {},
  created () {
  },
  mounted () {
    this.getSlots()
    console.log(this.scopedSlots)

    console.log(this.slots)
  },
  beforeDestroy () { }
}
</script>

<style lang="less" >
.ry-table-container {
  .empty-container {
    margin-top: 80px;
    margin-bottom: 80px;
  }

  .ant-table-wrapper {
    .ant-table-fixed-right {
      border-radius: 0;
      background: #fff;
    }
    td,
    th {
      border-left: 1px solid fade(@primary-color, 60%) !important;

      border-bottom: 1px solid fade(@primary-color, 60%) !important;
    }
    table {
      border-top: 1px solid fade(@primary-color, 60%) !important ;
      border-right: 1px solid fade(@primary-color, 60%) !important ;
      tbody > tr:nth-child(2n + 1) {
        background: fade(@primary-color, 10%);
      }
    }
    .ant-table-bordered .ant-table-header > table,
    .ant-table-bordered .ant-table-body > table,
    .ant-table-bordered .ant-table-fixed-left table,
    .ant-table-bordered .ant-table-fixed-right table {
      border: 0;
    }
  }
}
</style>
